"use client"

import { useActionState, useEffect } from "react";
import { useInsertInput } from "../../input/input";
import { action2 } from "../../action/action";

export default () => {

  const [_theme, theme, isCheck] = useInsertInput({ name: 'theme' });

  const [state, dispatch] = useActionState(async (_: LoginResponse | null, formdata: FormData) => await action2(formdata), null);
  const { code } = state ?? {};

  useEffect(() => {
    if (code == 0) {
      alert("主题更新成功");
    }
  }, [code, _theme]);

  return <>
    <div>
      <form action={dispatch}>
        <p>theme: {theme}</p>

        <button type="submit" style={{ backgroundColor: '#00BCD4', padding: '2px 20px', borderRadius: '5px' }}
          disabled={!isCheck}>
          确认
        </button>
      </form>
    </div>
  </>
}